<template>
    <div class="pagination">
        <el-pagination class="flex fix-end" @current-change="handleCurrentChange" @size-change="handleSizeChange"
            :current-page="currentPage" :page-sizes="pageSizes" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper"
            :total="total">
        </el-pagination>
    </div>
</template>

<script type="text/ecmascript-6">
export default {
    data() {
        return {};
    },
    mounted() {},
    created() {},
    computed: {},
    methods: {
        handleCurrentChange(val) {
            this.$emit("handleCurrentChange", val);
        },
        handleSizeChange(val) {
            this.$emit("handleSizeChange", val);
        }
    },
    watch: {},
    components: {},
    props: {
        currentPage: {
            type: Number,
            default: 1
        },
        pageSizes: {
            type: Array,
            default: function() {
                return [10, 20, 30, 40, 50];
            }
        },
        pageSize: {
            type: Number,
            default: 10
        },
        total: {
            type: Number,
            default: 0
        }
    }
};
</script>

<style scoped lang="less">
</style>
